<!-- eslint-disable vue/multi-word-component-names -->
<template>
  <div>
    <el-col>
      <h5 class="mb-2">主菜单</h5>
      <el-menu default-active="2" class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose" router>
        <el-menu-item index="dataOverView">
          <el-icon><icon-menu /></el-icon>
          <span>数据概览</span>
        </el-menu-item>
        <el-menu-item index="candiDate">
          <el-icon><icon-menu /></el-icon>
          <span>候选人管理</span>
        </el-menu-item>
        <el-sub-menu>
          <template #title>
            <el-icon>
              <location />
            </el-icon>
            <span>题库管理</span>
          </template>
          <el-menu-item index="topicType">
            <el-icon><icon-menu /></el-icon>
            <span>题目分类管理</span>
          </el-menu-item>
          <el-menu-item index="topicPaper">
            <el-icon><icon-menu /></el-icon>
            <span>题目集管理</span>
          </el-menu-item>
          <el-menu-item index="topic">
            <el-icon><icon-menu /></el-icon>
            <span>题目管理</span>
          </el-menu-item>
        </el-sub-menu>

        <el-menu-item index="interviewRecord">
          <el-icon><icon-menu /></el-icon>
          <span>面试记录</span>
        </el-menu-item>
        <el-menu-item index="interviewArrangement">
          <el-icon><icon-menu /></el-icon>
          <span>面试安排</span>
        </el-menu-item>

        <el-menu-item index="positionManagement">
          <el-icon><icon-menu /></el-icon>
          <span>职位管理</span>
        </el-menu-item>
        <el-menu-item index="interviewer">
          <el-icon><icon-menu /></el-icon>
          <span>面试官管理</span>
        </el-menu-item>
        <h5 class="mb-2">系统</h5>
        <el-menu-item index="systemSetting">
          <el-icon><icon-menu /></el-icon>
          <span>系统设置</span>
        </el-menu-item>
      </el-menu>
    </el-col>

  </div>
</template>

<script setup lang="ts">
const handleOpen = (key: string, keyPath: string[]) => {
  console.log(key, keyPath)
}
const handleClose = (key: string, keyPath: string[]) => {
  console.log(key, keyPath)
}
</script>

<style scoped></style>

<style scoped>
.mb-2{
  margin-left: 20px;
}
</style>